
  .wrapper{
    height: 100%;
    .headWrap{
      position: fixed;
      z-index: 10;
      top: 0;
    }
    .tabs{
      display: flex;
      align-content:center;
      justify-content:space-around;
      font-size:28px;
      font-weight: bold;
      background: #F8F9FA;
      .tab{
        padding: 12px 0 16px 0;
        margin-bottom: 13px;
      }
      .active{
        border-bottom: 4px solid #22ADF7;
      }
    }
    .searchTime{
      display: flex;
      justify-content: space-between;
      align-items:center;
      padding:14px 32px;
      position: relative;
      background: #fff;
      width: 686px;
      .searchWrap{
        display: flex;
        width: 100%;
        height: 60px;
        border:1px solid rgba(34,173,247,1);
        border-radius: 12px;
        justify-content: space-between;
        align-items: center;
        .myicon{
          margin: 0 17px 0 32px;
        }
        .inputs{
          font-size: 28px;
          width: 100%;
          flex: 1;
        }
      }
    }
    .timeWrapper{
      display: flex;
      font-size: 26px;
      color: #000000;
      padding: 10px 30px;
      box-sizing: border-box;
      background: #fff;
      .time{
        flex: 1;
        picker{
          .picker{
            .text{
              color: #d4d4d4;
            }
            .theme{
              color: #22ADF7;
            }
          }
        }
      }
    }
    .waitWrap{
      padding-top: 244px;
      .order{
        padding:28px 32px 32px 32px;
        border: 10px solid #F8F9FA;
        .nameWrapper{
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          align-items: center;
          .name{
            color: #181819;
            font-size: 32px;
          }
          .status{
            color: #22ADF7;
            font-size: 30px;
            white-space: nowrap;
          }
        }
        .decRe{
          color: #999999;
          font-size: 24px;
          margin-top: 20px;
        }
        .planEs{
          display: flex;
          align-items: center;
          justify-content: space-between;
          margin-top: 20px;
          font-size: 24px;
          .TriangleImg{
            width: 24px;
            height: 24px;
            margin-right: 12px;
          }
          .planName{
            color: #181819;
          }
          .esName{
            color: #181819;
            .esTime{
              color: #FF722A;
            }
          }
        }
        .Merchant{
          color: #181819;
          font-size: 24px;
          margin: 20px 0 24px 0;
        }
        .item{
          color: #181819;
          font-size: 24px;
          margin-top: 20px;
          label{
            checkbox {
              zoom: 80%;
            }
          }
          .theme{
            color: rgb(21, 173, 255);
          }
        }
        .btnWrapper{
          display: flex;
          flex-direction: row;
          margin-top: 20px;
          .cancel{
            margin: 0 40px 0 0;
          }
          .confirm{
            flex: 1;
            background-color: #22ADF7;
            color: #fff;
          }
          .disabled{
            background: #cccccc;
            &::after{
              border: none;
            }
          }
        }
      }
    }
    .upload{
      font-size: 24px;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-top: 32px;
      &:last-child{
        margin-top: 16px;
      }
      .uploadText{
        color: rgba(24, 25, 25, 1);
        font-size: 20px;
      }
      .item {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
        .fileUpload{
          background: rgba(250, 250, 250, 1);
          width: 68px;
          height: 68px;
          position: relative;
          &::before{
            content: ' ';
            width: 28px;
            height: 4px;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(229, 229, 229, 1);
          }
          &::after{
            content: ' ';
            width: 4px;
            height: 28px;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(229, 229, 229, 1);
          }
        }
        .clock{
          width: 68px;
          height: 68px;
          background: #22ADF7;
          box-shadow: 0px 6px 16px rgba(34, 173, 247, 0.2);
          border-radius: 50%;
          color: #ffffff;
          display: flex;
          justify-content: center;
          align-items: center;
          font-size: 18px;
          white-space:pre-wrap;
        }
        .fileContent{
          display: flex;
          align-items: flex-end;
          overflow: hidden;
          .close{
            margin-left: 10px;
          }
        }
      }
    }
  }
